<?php if (!defined('THINK_PATH')) exit();?><!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>城市合伙人 - <?php echo ($config["WEB_SITE_TITLE"]); ?></title>
    <script src="/Public/Home/js/adaptive.js"></script>
    <script src="/Public/Home/js/device.min.js"></script>
    <link rel="stylesheet" href="/Public/Home/css/reset.css">
    <link rel="stylesheet" href="/Public/Home/css/con-header.css">
    <script src="/Public/Home/js/mui.min.js"></script>
    <link href="/Public/Home/css/mui.min.css" rel="stylesheet"/>

    <style>
        h4,h5{margin-top: 0px;margin-bottom: 0px;}
        input::-webkit-input-placeholder,
        textarea::-webkit-input-placeholder {
            color: #9B9B9B;font-size: 0.3rem;
        }

        .content{width: 7.5rem;height: auto;margin: 0 auto;background: #fff;margin-top: 0.88rem;z-index: 10;padding-bottom: 1rem;}
        .top a{position: absolute;right: 0.3rem;bottom: 0.1rem;color: #fff;}
        .top{z-index: 100!important;}


        .xiugai{width: 100%;height: auto;padding: 0px 0.2rem;background: #fff}
        .xiugai li{width: 100%;height: auto;border-bottom: 1px solid #DEDEDE;color: #4A4A4A;line-height: 0.9rem;position: relative;font-size: 0.32rem;}
        .xiugai li input{width: 5.5rem;height: 0.88rem;border: none;outline: none;position: absolute;left: 1.5rem;text-align: right;line-height: 0.8rem; }
        .xiugai li:nth-child(5){border-bottom: none;height: 2rem;position: relative}
        .xiugai li:nth-child(4) span{float: right;font-size: 0.3rem;color: #999}
        .xiugai li:nth-child(4) span img{width: 0.2rem;height: 0.3rem;margin-left: 0.1rem;position: relative;top: 0.05rem;}
        .xiugai li textarea{width: 100%;height: 2rem;resize: none;border: none;top: 0px;}

        .xiugai li:nth-child(6) input{width: 5.3rem}
        .xiugai .kec{border-bottom: none}
        .xiugai li:nth-child(6) a{color: #333;}
        .xiugai li .img_num{color: #333;float: right}

        .shanchu a{float: right}



        /*添加图片*/
        .btm-tijiao{position: relative;padding:0.3rem;}
        .btm-tijiao .add{width: 2rem; height: 2rem;float: left;}
        .btm-tijiao input[type=file]{float: left;
            background-size:cover;width: 100px;height: 100px;text-decoration: none;position: absolute;left: 0.3rem;top: 0.3rem;opacity: 0;}
        .next{width: 90%;height: 0.9rem;border-radius: 0.5rem;display: block;line-height: 0.9rem;
        ;text-align: center;background: #19B7BE;color: #fff;font-size: 0.32rem;margin-top: 1rem;}

        .btm-tijiao .s-img{width: 100%;height: auto}
        .btm-tijiao .s-img li{float: left;margin-right: 0.2rem;}
        .btm-tijiao .s-img li img{width: 2rem; height: 2rem}
        .mendian{font-size: 0.34rem;padding-left:0.3rem;box-sizing: border-box;margin-top: 0.5rem; }


        /*添加视频*/
        .addvideo{width: 100%;height:3.6rem;background: #EEEEEE;}
        .addvideo img{margin-top: 1.2rem;}
    </style>
</head>
<body>


<div class="content">
    <div class="top">
        <h4>入驻城市合伙人</h4>
        <span class="back"></span>
    </div>

    <ul class="xiugai">
        <li>商家名称 <input type="text" ></li>
        <li>收货人 <input type="text" ></li>
        <li>联系地址 <input type="text"></li>
        <li>所在地区 <span>请选择 <img src="/Public/Home/img/back-right.png" alt=""></span></li>
        <li><textarea name="" id="t1" cols="30" rows="10" placeholder="详细地址"></textarea></li>
        <li>生源数量 <input type="text"><a style="float: right">人</a></li>
        <li>机构课程</li>
        <li class="kec"><textarea name="" id="t2" cols="30" rows="10" placeholder="请填写机构课程"></textarea></li>

        <li>门头照片 <span class="img_num">(0/6)</span></li>
    </ul>
    <!--添加图片-->
    <div class="btm-tijiao">

        <img src="/Public/Home/img/addimg.png" alt="" class="add">
        <input type="file" name="file" id="file"  accept="image/*" onchange="showPic(this)" multiple="multiple"  >
        <ul class="s-img">
            <li><img src="" alt=""></li>
        </ul>
    </div>

    <div style="clear: both"></div>
    <p class="mendian">门店视频</p>


    <div class="addvideo">
        <img src="/Public/Home/img/add.png" alt="" class="juzhong">
        <p style="text-align: center">添加视频</p>

    </div>


    <a href="<?php echo U('User/Admission_cit_next');?>" class="juzhong next">下一步</a>
</div>
<script src="/Public/Home/js/jquery-1.11.1.js"></script>
<script>
    $(".back").click(function () {
        window.history.back(-1);
    })




</script>

<script>
    function showPic(e) {
        let n=0
        let  file=e.files[0]
        //创建读取文件的对象
        var reader = new FileReader();

        //创建文件读取相关的变量
        var imgFile;

        //为文件读取成功设置事件
        reader.onload=function(e) {
            // alert('文件读取完成');
            imgFile = e.target.result;
            console.log(imgFile);
            n++;
            if(n<=5){
                $(".s-img").append("<li><img src='' class='limg'></li>");
                $(".s-img li:last").find(".limg").attr("src",imgFile);
            }else{

            }
        };

        //正式读取文件
        reader.readAsDataURL(file);

    }
</script>
</body>
</html>